﻿<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server"><title>ProductClass</title>
	<script type="text/javascript" src="../../Scripts/jquery-1.4.1.min.js"></script>
	<script type="text/javascript" src="../../Scripts/jquery.jbind.js"></script>
	<script type="text/javascript" src="../../Scripts/jquery.treeTable.js"> </script>
	<script src="../../Scripts/jquery.easyui.min.js" type="text/javascript"></script>
	<script type="text/javascript" src="../../Scripts/jquery.FixedHeadTable.js"> </script>
	<link href="../../Content/jquery.treeTable.css" rel="stylesheet" type="text/css" />
	<link href="../../Content/easyui.css" rel="stylesheet" type="text/css" />
	<style type="text/css">
		ul li { line-height: 30px; }
	</style>
</head>
<body>
	<div style="float: left; width: 250px; overflow: auto;">
		<ul id="tt" class="easyui-tree">
			<%=ViewData["classData"] %>
		</ul>
	</div>
	<div style="float: left; margin-left: 10px;">
		<table id="logList" style="width: 430px;">
			<thead>
				<tr>
					<th style="width: 90px">
						<a href="#" onclick="AddNew()">Add</a>
					</th>
					<th style="">Product name</th>
				</tr>
				<tr id='logList_bt' style="display: none">
					<td>
						<a href="/Admini/ProductDetail?id={ID}">Modify </a>
						<a href="#" onclick="deleteProduct('{ID}')">Delete</a></td>
					<td>{ProductName}</td>
				</tr>
			</thead>
		</table>
	</div>
	<script type="text/javascript">
		function AddNew() {
			if (classID == 0) {
				alert("Please select a class at first");
				return;
			}
			location.href("/Admini/ProductDetail?classID=" + classID)
		}
		var classID = 0;
		$(document).ready(function () {
			$("#logList").treeTable();
			$.ajax({
				cache: false,
				url: "/Admini/Getall",
				success: function (aaa) {
					$('#tt').tree({
						data: aaa,
						onClick: function (node) {
							classID = node.id;
							$("#logList").treeTable({
								treeColumn: -1,
								key: "ID",
								bind: {
									templateID: "#logList_bt",
									url: "/Admini/GetProductsByClass",
									ajaxPara: { id: classID },
									ajaxSuccess: function (re) { }
								}
							});
						}
					});
				}
			});
		});

		function deleteProduct(id) {
			if (confirm("Confirm delete this product message?")) {
				$.ajax({
					cache: false,
					data: { id: id },
					url: "/Admini/DeleteProductClass",
					success: function (aaa) {
						if (aaa) {
							alert("Product message has deleted");
							$("#logList").ttGetItem(id).ttRemove();
						}
					}
				});
			}
		}
	</script>
</body>
</html>
